<template>
  <div>
    <van-nav-bar title="性别修改"
                 left-arrow
                 right-text="确认"
                 @click-left="onClickLeft"
                 @click-right="onClickRight" />
    <van-radio-group v-model="data.checked">
      <van-cell-group>
        <van-cell title="男"
                  clickable
                  @click="data.checked = '1'">
          <template #right-icon>
            <van-radio name="1" />
          </template>
        </van-cell>
        <van-cell title="女"
                  clickable
                  @click="data.checked = '2'">
          <template #right-icon>
            <van-radio name="2" />
          </template>
        </van-cell>
      </van-cell-group>
    </van-radio-group>
  </div>
</template>
<script>
import { Toast } from 'vant'
import { getCurrentInstance } from 'vue'
export default {
  setup () {
    const { ctx, proxy } = getCurrentInstance()
    const data = {
      checked: '1'
    }
    function onClickLeft () {
      window.history.length > 1
        ? proxy.$router.go(-1)
        : proxy.$router.push('/userinfo')
    }
    function onClickRight () {
      const that = this
      proxy.$axios.user.changeGender(that.checked).then((res) => {
        if (res.status === 200) {
          Toast.success('修改成功')
        }
      })
    }
    return {
      data,
      onClickLeft,
      onClickRight
    }
  }
}
</script>
<style lang="scss" scoped>
</style>
